<!DOCTYPE html>
<html>
<head>
	<title></title>
	<style type="text/css"></style>
	<script type="text/javascript" src="./js/d3.v3.min.js"></script>
	<script type="text/javascript">
		window.onload=function(){
			// 用append添加元素
			// let body=d3.select("body")
			// body.append("p").text("西安")


			// 数据绑定之update
			let arr=["北京","上海","广州","深圳"]

			let body=d3.select("body")
			body.selectAll("p").data(arr).text((item,index)=>{
				return item;
			})


			// 数据绑定之enter
			let arr=["北京","上海","广州","深圳"]
			let body=d3.select("body")
			body.selectAll("p").data(arr)
				.enter()			//数据比元素多出来的部分
				.append("p")
				.text((item,index)=>{
					return item;
				})


		}
	</script>
</head>
<body>
	<p></p>
	<p></p>
	<p></p>
	<p></p>


</body>
</html>